<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <title>Morisky用药依从性问卷</title>
    <!-- 引入 vant UI 组件库样式文件 -->
    <link rel="stylesheet" href="../../../common/css/vant-index.css" />
    <style rel="stylesheet">
        body {
            background-color: #f7f8fa;
        }

        a {
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        }

        a:-webkit-any-link {
            color: #eee;
        }

        .container {
            border: 1px solid #f5f5f5;
            box-shadow: -1px 5px 5px #ececec;
            border-radius: 10px;
            margin: 0.6rem;
            padding: 0;
        }

        .van-cell__title {
            flex: 2;
        }

        #lists {
            margin-top: 0.2rem;
            font-size: 1rem;
            font-weight: 350;
            color: #8c8b8c;
            text-align: left;
        }

        .van-cell-group--inset {
            margin: 0;
        }

        .tab-btn {
            margin: 0.2rem;
            height: 1.7rem;
            line-height: 1.7rem;
        }

        #tabs-title {
            background-color: #11428c;
            display: flex;
        }

        #left-btn {
            flex: 1;
        }

        #right-btn {
            margin-right: 0.5rem;
        }


        .evalution_value {
            height: 3rem;
            width: 100%;
            background-color: #E22E30;
            text-align: center;
            line-height: 3rem;
            bottom: 0;
            margin-top: 3rem;
            margin-bottom: 0.5rem;
        }

        .van-button::before {
            background-color: red;
        }

        .evalution_button {
            margin: 0.2rem 0.2rem;
        }

        .evalution_button_list {
            margin: 0.2rem 0.2rem;
            width: 45%;
        }

        .bgcolor {
            background-color: #E22E30;
            color: #fff;
        }
		
		.bgcolorred {
		    background-color: #E22E30;
		    color: #fff;
		}
		.bgcolorblue {
		    background-color: #005BAC;
		    color: #fff;
		}
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <van-nav-bar v-if='from!="weapp"' title="Morisky用药依从性问卷" left-text="返回" left-arrow @click-left="onClickLeft"
            @click-right="onClickRight">
            <template #right>
                <van-icon name="wap-home-o" size='18' />
            </template>
        </van-nav-bar>
        <div class="container" :class="from=='weapp'?'padding-bottom':''">
            <span>1.您是否有时忘记服药？</span>
            <div class="evalution_button">
                <van-button round class="evalution_button_list" :class="statisticsPeriod==0?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio1=0,getButtonChange(0)">否
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod==1?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio1=1,getButtonChange(1)">是
                </van-button>

            </div>
            <span>2.在过去的2周内，是否有一天或几天您忘记服药？</span>
            <div class="evalution_button">
                <van-button round class="evalution_button_list" :class="statisticsPeriod1==0?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio2=0,getButtonChange1(0)">否
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod1==1?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio2=1,getButtonChange1(1)">是
                </van-button>

            </div>
            <span>3、治疗期间，当您觉得症状加重或出现其他症状时，您是否未告知医生而自行减少药量或停止服药？
            </span>
            <div class="evalution_button">
                <van-button round class="evalution_button_list" :class="statisticsPeriod2==0?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio3=0,getButtonChange2(0)">否
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod2==1?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio3=1,getButtonChange2(1)">是
                </van-button>

            </div>
            <span>4、当您外出旅行或长时间离家时，您是否有时忘记随身携带药物？

            </span>
            <div class="evalution_button">
                <van-button round class="evalution_button_list" :class="statisticsPeriod3==0?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio4=0,getButtonChange3(0)">否
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod3==1?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio4=1,getButtonChange3(1)">是
                </van-button>

            </div>
            <span>5.昨天您服药了吗？</span>
            <div class="evalution_button">
                <van-button round class="evalution_button_list" :class="statisticsPeriod4==0?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio5=0,getButtonChange4(0)">否
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod4==1?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio5=1,getButtonChange4(1)">是
                </van-button>

            </div>
            <span>6.当您觉得自己的血压已经得到控制时，您是否停止过服药？</span>
            <div class="evalution_button">
                <van-button round class="evalution_button_list" :class="statisticsPeriod5==0?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio6=0,getButtonChange5(0)">否
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod5==1?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio6=1,getButtonChange5(1)">是
                </van-button>

            </div>
            <span>7.您是否觉得要坚持治疗计划有困难？</span>
            <div class="evalution_button">
                <van-button round class="evalution_button_list" :class="statisticsPeriod6==0?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio7=0,getButtonChange6(0)">否
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod6==1?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio7=1,getButtonChange6(1)">是
                </van-button>

            </div>
            <span>8.您觉得要记住按时按量服药很难吗？</span>
            <div class="evalution_button">
                <van-button round class="evalution_button_list" :class="statisticsPeriod7==0?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio8=0,getButtonChange7(0)">从不
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod7==1?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio8=1,getButtonChange7(1)">偶尔
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod7==2?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio8=2,getButtonChange7(2)">有时
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod7==3?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio8=3,getButtonChange7(3)">经常
                </van-button>
                <van-button round class="evalution_button_list" :class="statisticsPeriod7==4?(from=='weapp'?'bgcolorblue':'bgcolorred'):''"
                    @click="this.radios.radio8=4,getButtonChange7(4)">所有时间
                </van-button>

            </div>

            <div class="evalution_value" @click="postMmas8" v-if="status==true&&from==''">
                <span style="color: #f3f3f3;">提交问卷</span>
            </div>
			<div class="evalution_value" style="background-color: #005BAC;" @click="postMmas8" v-if="status==true&&from=='weapp'">
			    <span style="color: #f3f3f3;">提交问卷</span>
			</div>

        </div>
    </div>
</body>
<!-- 上线环境用 -->
<script src="../../../common/js/vue.global.prod.js"></script>
<!-- 引入 UI 组件库 -->
<script src="../../../common/js/vant.min.js"></script>
<!-- axios 接口调用 -->
<script src="../../../common/js/axios.min.js"></script>

<script src="../../../base.js"></script>
<script src="../../../common/js/url.min.js"></script>

<script type="module">

    import {
        getAction,
        postAction,
        getUrl,
    } from "../../../common/js/api/vue3-axios-utils.js";
	
    const PatientData = {
        data() {
            return {
                url: {
                    postMmas8: "/105/03/1050301",
                    getMmas8Info: "/105/03/1050302",

                },
                status: true,
                currentData: {},
                statisticsPeriod: null,
                statisticsPeriod1: null,
                statisticsPeriod2: null,
                statisticsPeriod3: null,
                statisticsPeriod4: null,
                statisticsPeriod5: null,
                statisticsPeriod6: null,
                statisticsPeriod7: null,

                radios: {
                    radio1: null,
                    radio2: null,
                    radio3: null,
                    radio4: null,
                    radio5: null,
                    radio6: null,
                    radio7: null,
                    radio8: null,

                },
				patientId:'',
				from:''
            };
        },


        methods: {
            getButtonChange(value) {
                this.statisticsPeriod = value;
            },
            getButtonChange1(value) {
                this.statisticsPeriod1 = value;
            },
            getButtonChange2(value) {
                this.statisticsPeriod2 = value;
            },
            getButtonChange3(value) {
                this.statisticsPeriod3 = value;
            },
            getButtonChange4(value) {
                this.statisticsPeriod4 = value;
            },
            getButtonChange5(value) {
                this.statisticsPeriod5 = value;
            },
            getButtonChange6(value) {
                this.statisticsPeriod6 = value;
            },
            getButtonChange7(value) {
                this.statisticsPeriod7 = value;
            },

            getPatientId() {
                let patientId = this.patientId
            },

            async postMmas8() {

                let inputs = [];
                for (let i in this.radios) {
                    inputs.push(this.radios[i]);

                }
                for (let k in inputs) {
                    if (inputs[k] == null) {
                        vant.Toast.fail('请填写所有选项!');
                    }
                    break
                }



                let url =
                    getUrl() + this.url.postMmas8;
				let patientId = this.patientId
                let params = {
                    // 患者 ID 从本地存储空间的 pid 获得
                    patientId: patientId,
                    answers: inputs

                };
                const res = await postAction(url, params);
                if (res.data.success) {
                    vant.Toast.success('3秒后查看结果');
                    // 定时跳转
					if(this.from){
						setTimeout("javascript:history.go( -1 )", 3000);
					}else{
						setTimeout("javascript:location.href='./mmas8Info.html'", 3000);
					}
                }
            },
            onClickLeft() {
                window.location.href = './mmas8Info.html'
            },
            onClickRight() {
                window.location.href = '../../index.html?userid=' + localStorage.pid
            },
        },
        created() {
			if(url('?from')=='weapp'){
				this.from = 'weapp'
			}
			if(url('?pid')){
				this.patientId = url('?pid')
			}else{
				this.patientId = localStorage.pid;
			}
            var status = window.location.search.slice(8,9)
            if (status == 1) {
                let patientId = this.patientId
                let params = {
                    patientId: patientId
                }

                let url =
                    getUrl() + this.url.getMmas8Info;
                getAction(url, params).then((res) => {
                    console.log(res.data.result.answers);
                    this.statisticsPeriod = res.data.result.answers[0],
                        this.statisticsPeriod1 = res.data.result.answers[1],
                        this.statisticsPeriod2 = res.data.result.answers[2],
                        this.statisticsPeriod3 = res.data.result.answers[3],
                        this.statisticsPeriod4 = res.data.result.answers[4],
                        this.statisticsPeriod5 = res.data.result.answers[5],
                        this.statisticsPeriod6 = res.data.result.answers[6],
                        this.statisticsPeriod7 = res.data.result.answers[7],
                        this.status = false
                })
            }
            this.getPatientId()
        },

    };

    const app = Vue.createApp(PatientData);

    app.use(vant);
    // 通过 CDN 引入时不会自动注册 Lazyload 组件
    // 可以通过下面的方式手动注册
    app.use(vant.Lazyload);

    // 调用函数组件，弹出一个 Toast
    // vant.Toast("刷新成功");
    app.mount("#app");
</script>

</html>
